<!DOCTYPE html>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="sf" uri="http://www.springframework.org/tags/form"%>

<html>
	<head>
		<script src="<c:url value="/recursos/js/contato.js"/>"></script>
	</head>
	
	<body class="body-login">
	
		<section id="inner-headline">
			<div class="container">
				<div class="row">
					<div class="col-lg-12">
						<ul class="breadcrumb">
							<li><a href="<c:url value="/"/>"><i class="fa fa-home"></i></a><i class="icon-angle-right"></i></li>
							<li class="active">Contato</li>
						</ul>
					</div>
				</div>
			</div>
		</section>
		
		<%@include file="mensagem.jsp" %>
		
		<section id="content">
			<div class="container">
				<div class="row">
					<div class="col-lg-5">
						<div class="panel panel-default">
							<div class="login-body">

								<h3 class="thin text-center">
									<i class="smmb-icon fa fa-envelope blue"></i>
									Envie sua mensagem
								</h3>
								<hr>
							
								<sf:form modelAttribute="contato" method="post" action="/enviarEmail" class="form-horizontal" id="contatoForm">
																		
																		
					                <div class="form-group">
					                    <label class="col-sm-2 control-label">Nome<span class="text-danger">*</span></label>
					                    <div class="col-sm-12">
											<span class="block input-icon input-icon-right">
													<input type="text" class="form-control" name="nome" value="${contato.nome}"/>
													<i class="smmb-icon fa fa-user"></i>
											</span>
					                    </div>
									</div>					
																		
									<div class="form-group">
					                    <label class="col-sm-2 control-label">Telefone<span class="text-danger">*</span></label>
					                    <div class="col-sm-12">
											<span class="block input-icon input-icon-right">
													<input type="text" class="form-control" name="telefone" value="${contato.telefone}"/>
													<i class="smmb-icon fa fa-phone"></i>
											</span>
					                    </div>
									</div>	
									
									<div class="form-group">
					                    <label class="col-sm-2 control-label">Email<span class="text-danger">*</span></label>
					                    <div class="col-sm-12">
											<span class="block input-icon input-icon-right">
													<input type="text" class="form-control" name="email" value="${contato.email}"/>
													<i class="smmb-icon fa fa-envelope"></i>
											</span>
					                    </div>
									</div>	
									
									<div class="form-group">
					                    <label class="col-sm-2 control-label">Mensagem<span class="text-danger">*</span></label>
					                    <div class="col-sm-12">
											<span class="block input-icon input-icon-right">
												<textarea rows="8" name="mensagem" class="form-control">${contato.mensagem}</textarea>
											</span>
					                    </div>
									</div>	
									
									
									<div class="form-group">
			                            <div class="col-sm-12">
			                                <button type="submit" class="pull-right btn btn-success">
			                                	<i class="smmb-icon fa fa-envelope"></i>
			                                	<span class="bigger-110">Enviar</span>
			                               	</button>
			                            </div>
									</div>
									
								</sf:form>
							</div>
						</div>		
					
					</div>
					<div class="col-lg-7">
						<div id="map-contato"></div>
					</div>
				</div>
			</div>
		</section>
		<script type="text/javascript">initMapaContato();</script>	

	</body>
</html>